Component コンポーネント code

UIの部品をモジュール modules化したもの

Vue.jsにおいて

Vue.jsのコンポーネント

再利用可能なVueインスタンス

UIの部品をモジュール化したものをUIコンポーネント

Reactにおいて

全ての React コンポーネントは、自己の props に対して純関数のように振る舞わねばなりません。

コンポーネントシステム

関数やメソッドを適切な粒度・役割で分割するように、インスタンスをコンポーネント単位で分割する

粒度

メリット

再利用性が高まり、開発効率が上がる

既に使用したコードを使うので、品質が保てる

小さくテストするの重要

疎結合にすることで、保守性が高まる

開発範囲を限定できる

定義

グローバル　ローカル

Vue.component() カスタムタグ方式

Vue.component(tagName,options)

Vue.extend() サブコンストラクタ方式

データの受け渡し

Props親から子

$emit子から親

HTML HyperText Markup Languageでは、cabab-caseでしか駄目なところがある

しかし、検索性が下がるので、PscalCaseにするのが良さげ

ファイル構成